<template>
	<view class="container">
		<uni-section title="案件信息" type="line"></uni-section>
		<case-detail :selectedCase="selectedCase"></case-detail>
		<uni-section title="督办信息" type="line">
			<view class="list-item">
				<view class="list-row">
					<view class="list-row-label">截止时间</view>
					<view class="list-row-content">{{urgeInfo.urgeDeadline}}</view>
				</view>
				<view class="list-row">
					<view class="list-row-label">督办要求</view>
					<view class="list-row-content">{{urgeInfo.urgeDesc}}</view>
				</view>
			</view>
		</uni-section>
		<uni-section title="督办回复" type="line">
			<view style="padding:5px 16px">
				<uni-uform v-model="form" :label-width="85" ref="uform" :config="config" :rules="rules"
				validate-trigger="bind" :show-border="true" :label-align="align" label-position="top">
				</uni-uform>
				<view class="footer-btn-content">
					<button size="mini" v-if="type !== 'view'" class="common-mini-btn primary-btn" @click="handleSubmit">提交</button>
					<button size="mini" class="common-mini-btn other-btn" @click="handleCancel">取消</button>
				</view>
				<!-- <uni-forms ref="baseForm" :model="caseForm" label-position="top" label-width="105">
					<uni-forms-item label="督办要求" required name="dealDesc">
						<uni-easyinput v-model="caseForm.dealDesc"  type="textarea" placeholder="督办要求">{{dealDesc}}</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item >
						<template #label>
							<view style="display: flex;justify-content: space-between;">
								<text>是否短信提醒</text>
								<switch @change="handleChange"></switch>
							</view>
						</template>
					</uni-forms-item>
				</uni-forms> -->
			</view>
		</uni-section>
		<uni-popup ref="popup" type="center" background-color="#fff" class="uni-popup">
			<view class="popup-content">
				<uni-title type="h3" title="问责" align="center"></uni-title>
				<view class="uni-list">
					<case-list-content :list-data="caseUrgeDutyList" :rows="rows">
						<!-- <template #cssx="item">
							<view class="list-row" >
								<view class="list-row-label" style="color: #ff0000;">超时时限</view>
								<view class="list-row-content" style="color: #ff0000;">{{item.data.cssx}}</view>
							</view>
						</template> -->
					</case-list-content>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import { getCaseDetail } from '@/api/dums/caw/caseInfo.js'
	import {saveCaseUrgeReply,getCaseUrgeReplyDetail} from "@/api/dums/caw/caseUrgeReply.js";
	import {getCaseUrgeDetail, getCaseUrgeDutyList} from "@/api/dums/caw/urge.js";
	export default {
		data() {
			return {
				type:"",//deal回复 view查看
				caseId:"",
				urgeId:"",
				selectedCase:{},//案件详情
				urgeInfo:{},//督办详情
				caseUrgeDutyList: [],//督办问责
				rows: [{
					labelName: "问责意见",
					valueName: "dutyDesc"
				}],
				form: { // 建议申明属性与config数组的name保持一致
					replyDesc: "",
					caseId:"",
					urgeId:"",
					caseCode:""
				},
				align:"left",
				config: [{
						name: 'replyDesc',
						label: '回复内容',
						component: 'uni-easyinput',
						extra: {
							type: 'textarea',
							placeholder: "回复内容",
							required:true
						},
						event: {
							change: (e) => { // 操作 form字段的示例 改变config
								console.log(e, 'ss1', this)
							}
						}
					}
				],
				rules: {
					replyDesc: {
						rules: [{
							required: true,
							errorMessage: '不能为空',
						}]
					}
				}
			}
		},
		methods: {
			getDetailInfo(){
				getCaseDetail({caseId:this.caseId}).then(res =>{
					//console.log(JSON.stringify(res.data));
					if(res.code == 200){
						this.selectedCase = res.data;
						this.caseForm = Object.assign({},this.selectedCase);
						this.form.caseCode = res.data.caseCode;
						this.form.linkId = res.data.linkId;
					}
					return getCaseUrgeDetail(this.urgeId)
				}).then(res1 => {
					//console.log(JSON.stringify(res1));
					this.urgeInfo = res1.data;
					
				})
				
			},
			getCaseUrgeDutyList(){
				getCaseUrgeDutyList({caseId:this.caseId}).then(res=>{
					console.log(res);
					if(res.code == 200){
						this.caseUrgeDutyList = res.rows;
					}
				});
			},
			getReplyData(replyId){
				getCaseUrgeReplyDetail(replyId).then(res => {
					console.log(JSON.stringify(res));
					this.form.replyDesc = res.data.replyDesc;
				})
			},
			handleSubmit(){
				let _this = this;
				let form = this.$refs.uform.getForm()
				form.validate().then(res => {
					//_this.form.replyTime = new Date().getTime();
					//_this.form.replyUser = this.$store.state.user.userInfo.nickName;
					//_this.form.replyOrg = this.$store.state.user.userInfo.orgName;
					saveCaseUrgeReply(_this.form).then(res => {
						if(res.code == 200){
							_this.$modal.msgSuccess("提交成功");
							_this.getOpenerEventChannel().emit("refreshListEvent",{});
							_this.$tab.navigateBack();
						}else{
							_this.$modal.msgError("提交失败:"+res.msg);
						}
					});
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			handleCancel(){
				this.$tab.navigateBack();
			},
		},
		onLoad(options) {
			this.caseId = options.caseId;
			this.urgeId = options.urgeId;
			this.form.caseId = options.caseId;
			this.form.urgeId = options.urgeId;
			this.type = options.type;
			//获取事件信息
			this.getDetailInfo();
			//获取事件信息
			this.getCaseUrgeDutyList();
			if(this.type == "view"){
				//获取答复信息
				this.getReplyData(options.replyId)
				this.config[0].extra.disabled = true;
			}
		},
		onNavigationBarButtonTap : function (e) {
			//console.log(this.caseId);
			if(e.index == 0){//附件
				uni.navigateTo({
					url:'../../case-attach/case-attach?caseId='+this.caseId
				})
			}else if(e.index == 1){//办理进度
				uni.navigateTo({
					url:'../../case-process/case-process?caseId='+this.caseId
				})
			}else{//问责意见
				uni.navigateTo({
					url:'../../case-sup-duty/case-sup-duty?caseId='+this.caseId
				})
			}
		},
	}
</script>

<style>
	.list-item{
		padding: 16px;
		border-bottom: 1px solid #F1F1F1;
	}
	.list-row{
		display: flex;
		padding-bottom: 10px;
	}
	.list-row-label{
		font-family: MicrosoftYaHei;
		font-size: 14px;
		font-weight: normal;
		line-height: 17px;
		letter-spacing: 0px;
		color: #9DA0AA;
		width: 25%;
	}
	.list-row-content{
		font-family: MicrosoftYaHei;
		font-size: 14px;
		font-weight: normal;
		line-height: 17px;
		letter-spacing: 0px;
		width: 75%;
		color: #353B50;
		white-space:nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
</style>
